<template>
  <div>
    <!-- 未登录 -->
    <div class="headerRight" v-if="this.arr.length == 0">
      <p class="topBtn">
        <img src="@/assets/images/user.png" alt="">
        <a href="/login">登录</a>
        <span style="display:inline-block;vertical-align: middle;">｜</span>
        <a href="/register">注册</a>
      </p>
    </div>
    <!-- 已登录状态 -->
    <div class="headerRight userRight" v-else>
      <!-- <el-button @click="handleClose" type="primary">断开连接</el-button> -->
      <el-dropdown @command="handleCommand">
        <div class="userInfo">
          <div class="userItem">
            <p class="userName">
              <img :src="userInfo.avatar" alt="">
              <img v-if="this.userInfo.avatar === '' && this.userInfo.registrationType === 0"
                src="../../../assets/images/touxiangqy.png" alt="">
              <img v-if="this.userInfo.avatar === '' && this.userInfo.registrationType !== 0"
                src="../../../assets/images/touxianggr.png" alt="">

              <!-- <img src="@/assets/images/user.png" alt=""> -->
              <span :title="userInfo.nickName">{{ userInfo.nickName }}</span>
              <i class="el-icon-caret-bottom"></i>
            </p>
          </div>
        </div>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item command="1">个人中心</el-dropdown-item>
          <el-dropdown-item command="5">退出登录</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>
  </div>
</template>
<script>
import { logOut } from "@/request/api/login.js";
// import {web} from "@/utils/web.js"
import {
  getUserInfo,
} from "@/request/api/user";
export default {
  data() {
    return {
      userInfoMsg: {},
      arr: [],
      imgSrc: "",
      subscribeNumber: 0,
      poolNumber: 0,
      tradeNumber: 0,
      timer: null,
      iuiUserType: "",
      ieiName: "",
      isConsortium: "", ////判断是否是联合体
      userInfo: {},
    };
  },
  created() {
    this.isGetVal();
  },
  destroyed() {
    clearInterval(this.timer);
  },
  methods: {
    // 判断sessionStorge是否存值
    isGetVal() {
      if (window.sessionStorage.getItem("access_token") !== null) {
        this.getUserMsg()
      }
    },
    // 获取用户信息
    getUserMsg() {
      getUserInfo().then(res => {
        if (res.data.code === 200) {
          this.userInfo = res.data.result.user
          // 存储信息
          window.sessionStorage.setItem(
            "userInfo",
            JSON.stringify(this.userInfo)
          );
          this.arr = Object.keys(this.userInfo);

        }
      })
    },
    // 右上角点击事件
    handleCommand(command) {
      if (command == "1") {
        this.$router.push("/msgCenterNone");
				// this.$nextTick(() => {
				// 	// 在下一个 DOM 更新周期执行刷新操作
				// 	window.location.reload();
				// });
      } else if (command == "5") {
        this.getLogOut()
      }
    },

    // 退出登录
    getLogOut() {
      this.$confirm("是否确认退出登录?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        if (this.userInfo.staffType === '8') {
          this.$socketApi.wsChat.close()
          // 0        CONNECTING        连接尚未建立
          // 1        OPEN            WebSocket的链接已经建立
          // 2        CLOSING            连接正在关闭
          // 3        CLOSED            连接已经关闭或不可用
          // 判断状态为3表示已关闭
          setTimeout(() => {
            if (this.$socketApi.wsChat.readyState === 3) {
              this.getOutResult()
            }
          }, 1000);

        } else {
          this.getOutResult()
        }
      });
    },
    // 退出接口
    getOutResult() {
      logOut().then((res) => {
        if (res.data.code == 200) {
          this.$message({
            message: '退出成功！',
            type: "success",
          });
          sessionStorage.clear();
          this.$cookie.remove("access_token");
          if (this.$route.path === "/login") {
            location.reload();
          } else {
            this.$router.push("/login");
          }
        } else {
          this.$message.error(res.data.message);
        }
      });
    },
    // 全文检索
    handleSearch() {
      this.$router.push("/newSearch");
    },
  },
};
</script>
<style lang="less" scoped>
@import "./userLogin.less";
</style>
